{extend name="template/base_default"}
{block name="header"}

<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0,  maximum-scale=1.0, user-scalable=0" >
<link rel="stylesheet" href="__CSS__/common.css">
<link rel="stylesheet" href="__CSS__/index.css">
<link rel="stylesheet" href="__CSS__/weuix.min.css"/>
<link rel="stylesheet" href="__CSS__/weui.min.css">
<link rel="stylesheet" href="__CSS__/jquery-weui.css">
<link rel="stylesheet" href="__JS__/jquery-weui.min.js">

<style>

    body{
        background-image:url("__IMG__/bj.png");
        background-repeat:no-repeat;
        background-size:cover;
        display:inline-block;
        text-align: center;
        color:#eeeeee;
        width: 100%;
        background-attachment: fixed;
        margin: auto;
    }
    li{
        list-style:none;
    }
    .store-box{
        background-color: white;
        height:130px;
        margin-top: 30px;
    }
    .store-box img {
        width:100px;
        height:100px;
        float:right;
        margin-right: 10px;
        margin-top: 10px;
    }
    .store-success{
        margin-top: 20px;
        font-size: 18px;
        color:#545454;
        font-family: "Microsoft YaHei UI";
    }
    .store-text{
        float: left;
        margin-top: 30px;
        margin-left: 16px;
        text-align: left;
    }
    .store-detail{
        font-size: 14px;
        color:#8c8c8c;
        font-family: "Microsoft YaHei UI";
        margin-top: 12px;
    }
    .store-p{
        text-align: center;
        color:white;
        margin-top: 30px;
        font-family: "Microsoft YaHei UI";
        font-size: 18px;

    }
    .store-other {
        margin-top: 20px;
        margin-left: auto;
        margin-right: auto;
        height:140px;
        background-color: white;
        border-radius: 10px;
        width:90%;
        color:white;
        background-color: rgba(95, 110, 170, 0.4);
    }
    .comment-score{
        width:100%;
        background-color: white;
        display: none;

    }
    .store-other-img{
        width:90px;
        float: left;
        height:90px;
        margin-top: 14px;
        margin-left: 14px;
        border-radius: 10px;
    }
    .store-other-right{
        float: left;
        margin-left: 10px;

        width:50%;
        height:110px;
        margin-top: 14px;
    }
    .store-other-right-p1{
        font-family: "Microsoft YaHei UI";
        color:white;
        font-size: 18px;
        text-align: left;
        overflow: hidden;
    }
    .store-other-right-p2{
        font-family: "Microsoft YaHei UI";
        color:#c09853;
        font-size: 18px;
        text-align: left;
        margin-top: 6px;
    }
    .store-other-right-p3{
        font-family: "Microsoft YaHei UI";
        color:white;
        font-size: 14px;
        text-align: left;
        margin-top: 6px;
    }
    .pj-submit{
        width:100%;
        height:40px;
        color:white;
        line-height: 40px;
        background-color: #1f2f3d;
    }
    .close{
        width:100%;
        background-color: #f2f3f8;
        color:#545454;
        height:40px;
        line-height: 40px;
        font-size: 14px;
    }
</style>
{/block}
{block name="body"}

<div class="store-box">
    <div class="store-text">
        <ul>
            <li class="store-success">付款成功</li>

        </ul>
    </div>
    <img src="__IMG__/pingjia.png">
</div>
<div class='demos-content-padded' id="botton">
    <a class="weui-btn weui-btn_primary open-popup" style="margin-top: 30px;width:90%;margin-left: auto;margin-right: auto;border-radius: 100px;background-color: #5AC6F7;font-family: 'Microsoft YaHei UI'" data-target="#half">温馨评价</a>
</div>



<div class="comment-score">
<div class="page-hd" style="position:fixed;bottom:0;width:100%;background-color: white;padding: 0;margin: 0">
    <div class="close">关闭</div>
    <div class="weui-rater" style="margin-top: 20px">
        <a data-num = "0" class="weui-rater-box checked"> <span class="weui-rater-inner">★</span> </a>
        <a data-num = "1" class="weui-rater-box"> <span class="weui-rater-inner">★</span> </a>
        <a data-num = "2" class="weui-rater-box"> <span class="weui-rater-inner">★</span> </a>
        <a data-num = "3" class="weui-rater-box"> <span class="weui-rater-inner">★</span> </a>
        <a data-num = "4" class="weui-rater-box"> <span class="weui-rater-inner">★</span> </a>
    </div>

    <div id='fen' class="weui_cells_title"></div>
    <div class="close" style="bottom: 0;">提交</div>
</div>
</div>
<!--<div id="half" class='weui-popup__container popup-bottom' style="display: none">-->
    <!--<div class="weui-popup__overlay"></div>-->
    <!--<div class="weui-popup__modal">-->
        <!--<div class="toolbar">-->
            <!--<div class="toolbar-inner">-->
                <!--<a href="javascript:;" class="picker-button close-popup" style="color:#5AC6F7">关闭</a>-->
                <!--<h1 class="title">标题</h1>-->
            <!--</div>-->
        <!--</div>-->
        <!--<div class="modal-content" style="background-color: white">-->
            <!--<div class="weui-grids">-->

                <!--<div class="weui-rater">-->
                    <!--<a data-num = "0" class="weui-rater-box checked"> <span class="weui-rater-inner">★</span> </a>-->
                    <!--<a data-num = "1" class="weui-rater-box"> <span class="weui-rater-inner">★</span> </a>-->
                    <!--<a data-num = "2" class="weui-rater-box"> <span class="weui-rater-inner">★</span> </a>-->
                    <!--<a data-num = "3" class="weui-rater-box"> <span class="weui-rater-inner">★</span> </a>-->
                    <!--<a data-num = "4" class="weui-rater-box"> <span class="weui-rater-inner">★</span> </a>-->
                <!--</div>-->

                <!--<div id='fen' class="weui_cells_title"></div>-->
            <!--</div>-->
        <!--</div>-->
        <!--<div class="pj-submit">-->
            <!--提交-->
        <!--</div>-->
    <!--</div>-->
<!--</div>-->
{/block}
{block name="footer"}

<script>

    $(".close").click(function(){
        window.history.go(-3);
    })
    function upDownOperation(element)
    {
        var _input = element.parent().find('input'),
            _value = _input.val(),
            _step = _input.attr('data-step') || 1;
        //检测当前操作的元素是否有disabled，有则去除
        element.hasClass('disabled') && element.removeClass('disabled');
        //检测当前操作的元素是否是操作的添加按钮（.input-num-up）‘是’ 则为加操作，‘否’ 则为减操作
        if ( element.hasClass('weui-number-plus') )
        {
            var _new_value = parseInt( parseFloat(_value) + parseFloat(_step) ),
                _max = _input.attr('data-max') || false,
                _down = element.parent().find('.weui-number-sub');

            //若执行‘加’操作且‘减’按钮存在class='disabled'的话，则移除‘减’操作按钮的class 'disabled'
            _down.hasClass('disabled') && _down.removeClass('disabled');
            if (_max && _new_value >= _max) {
                _new_value = _max;
                element.addClass('disabled');
            }
        } else {
            var _new_value = parseInt( parseFloat(_value) - parseFloat(_step) ),
                _min = _input.attr('data-min') || false,
                _up = element.parent().find('.weui-number-plus');
            //若执行‘减’操作且‘加’按钮存在class='disabled'的话，则移除‘加’操作按钮的class 'disabled'
            _up.hasClass('disabled') && _up.removeClass('disabled');
            if (_min && _new_value <= _min) {
                _new_value = _min;
                element.addClass('disabled');
            }
        }
        _input.val( _new_value );
    }


    $(function(){
        $('.weui-number-plus').click(function(){
            upDownOperation( $(this) );
        });
        $('.weui-number-sub').click(function(){
            upDownOperation( $(this) );
        });

        //评分js
        var arr = ["1分","2分","3分","4分","5分"];
        var num = -1;
        $(".weui-rater a").mouseover(function(){
            var thisL = $(this).index();
            for(var i = 0;i < thisL;i++){
                $(".weui-rater a").eq(i).addClass('checked');
            }
            for(var i = thisL; i < 5;i++){
                $(".weui-rater a").eq(i).removeClass('checked');
            }
            $(this).addClass('checked');
        })
        $(".weui-rater a").mouseout(function(){
            var thisL = $(this).index();
            for(var i = thisL; i < 5;i++){
                $(".weui-rater a").eq(i).removeClass('checked');
            }
        })
        $(".weui-rater").mouseout(function(){

            for(var i = 0; i < num;i++){
                $(".weui-rater a").eq(i).addClass('checked');
            }
        })
        $(".weui-rater a").click(function(){
            var thisL = $(this).index();
            $("#fen").html(arr[thisL]);
            $(this).addClass('checked');
            num = thisL+1;
            console.log(num);
        })

    });

//    $(function(){
////        $('.weui-number-plus').click(function(){
////            upDownOperation( $(this) );
////        });
////        $('.weui-number-sub').click(function(){
////            upDownOperation( $(this) );
////        });
//
//        //评分js
//        var arr = ["1分","2分","3分","4分","5分"];
//        var num = -1;
//        $(".weui-rater a").click(function(){
//            var thisL = $(this).index();
//            for(var i = 0;i < thisL;i++){
//                $(".weui-rater a").eq(i).addClass('checked');
//            }
//            for(var i = thisL; i < 5;i++){
//                $(".weui-rater a").eq(i).removeClass('checked');
//            }
//            $(this).addClass('checked');
//        });
////        $(".weui-rater a").click(function(){
////            var thisL = $(this).index();
////            for(var i = thisL; i < 5;i++){
////                $(".weui-rater a").eq(i).removeClass('checked');
////            }
////        });
////        $(".weui-rater").click(function(){
////
////            for(var i = 0; i < num;i++){
////                $(".weui-rater a").eq(i).addClass('checked');
////            }
////        });
//        $(".weui-rater a").click(function(){
//            var thisL = $(this).index();
//            $("#fen").html(arr[thisL]);
//            $(this).addClass('checked');
////            num = thisL+1;
////            console.log(num);
//        });
//
//    });
</script>
<script>
    $('#botton').click(function(){
        //alert('1111');
        $('.comment-score').css("display","block");
    })
    $('.close').click(function(){
        //alert('1111');
        $('.comment-score').css("display","none");
    })



    $(document).on("open", ".weui-popup-modal", function() {
        console.log("open popup");
    }).on("close", ".weui-popup-modal", function() {
        console.log("close popup");
    });
</script>
{/block}